@extends('admin.layout.layout', ['row' => @$page])

@section('title', @$page['title'])

@section('contain')
    <link rel="stylesheet" href="/dist/admin/stat.css">
    <div class="container" style="background-color: #f7f9fa;padding-bottom: 20px; padding-top: 20px;max-width: 1300px;">
        <div style="width: 50%;float: left; padding: 5px 10px;">
            @if (!empty($user_type) && $user_type != 4)
            <div style="float: left; width: 20%;">
                <button type="button" class="btn btn-secondary" id="all_country">{{ ts('全国') }}</button>
            </div>
            @endif
            @if ($user_type != 2)
            <div style="float: left; width: 40%;">
                <div class="input-group mb-3 custom-control-inline">
                    <div class="input-group-prepend">
                        <span class="input-group-text">{{ ts('省代') }}</span>
                    </div>
                    <select class="form-control" style="width: 60%" id="distributions">
                        <option selected disabled value="">{{ ts('选择省代') }}</option>
                        @if (!empty($distributions))
                            @foreach($distributions as $distribution)
                                <option value="{{ $distribution->id }}">{{ $distribution->abbr }}</option>
                            @endforeach
                        @endif
                    </select>
                </div>
            </div>
            @endif
            <div style="float: left; width: 40%;">
                <div class="input-group mb-3 custom-control-inline">
                    <div class="input-group-prepend">
                        <span class="input-group-text">{{ ts('CITY') }}</span>
                    </div>
                    <select class="form-control" style="width: 60%" id="cities">
                        <option selected disabled value="">{{ ts('选择城市') }}</option>
                    </select>
                </div>
            </div>
            <!--<div style="float: left; width: 40%;">
                <div class="input-group mb-3 custom-control-inline">
                    <div class="input-group-prepend" style="width: 30%;">
                        <span class="input-group-text">经销商</span>
                    </div>
                    <select class="form-control" style="width: 70%" id="dealers">
                        <option selected disabled value="">选择经销商</option>
                    </select>
                </div>
            </div>-->
        </div>
        <div style="width: 50%;float: left; padding: 5px 10px;">
            <div class="input-group mb-3 custom-control-inline" style="float: left; width: 40%;">
                <div class="input-group-prepend">
                    <span class="input-group-text">{{ ts('YEAR') }}</span>
                </div>
                <select class="form-control" style="width: 50%;" id="year">
                    @for ($i = date('Y'); $i >= 2016; $i--)
                        <option value="{{ $i }}">{{ $i }}</option>
                    @endfor
                </select>
            </div>
            <div style="float: left; width: 15%; margin-left: 10%;">
                <button type="button" class="btn btn-secondary" id="select_month">按月</button>
            </div>
            <div style="float: left; width: 10%;">
                <button type="button" class="btn btn-primary" id="select_day">按日</button>
            </div>
        </div>
        @if (in_array('sdqms', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">省代漆膜质保分排名</div>
                    <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_6" class="startdate flatpickr form-control" value="">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_16" class="startdate flatpickr form-control" value="">
                    </div>
                    <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_6">
                            <option value="">月份总计</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_6">返回</span>
                        <span style="cursor: pointer;line-height: 380%;" id="look_roll_6">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_6"></div>
            </div>
        </div>
        @endif
        @if (in_array('jsxqms', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">经销商漆膜质保分排名</div>
                    <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_5" class="startdate flatpickr form-control" value="">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_15" class="startdate flatpickr form-control" value="">
                    </div>
                    <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_5">
                            <option value="">月份总计</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_5">返回</span>
                        <span style="cursor: pointer;line-height: 380%;" id="look_roll_5">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_5"></div>
            </div>
        </div>
        @endif
        @if (in_array('sdwms', $menus, true))
            <div class="widget-container widget-container-show">
                <div class="widget-content-container">
                    <div class="row show-title">
                        <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">省代窗膜质保分排名</div>
                        <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_8" class="startdate flatpickr form-control" value="">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_18" class="startdate flatpickr form-control" value="">
                        </div>
                        <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                            <select class="form-control" style="width: 80%;" id="month_8">
                                <option value="">月份总计</option>
                                <option value="01">一月</option>
                                <option value="02">二月</option>
                                <option value="03">三月</option>
                                <option value="04">四月</option>
                                <option value="05">五月</option>
                                <option value="06">六月</option>
                                <option value="07">七月</option>
                                <option value="08">八月</option>
                                <option value="09">九月</option>
                                <option value="10">十月</option>
                                <option value="11">十一月</option>
                                <option value="12">十二月</option>
                            </select>
                        </div>
                        <div style="padding-left: 4%; width: 20%;">
                            <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_8">返回</span>
                            <span style="cursor: pointer;line-height: 380%;" id="look_roll_8">查看更多</span>
                        </div>
                    </div>
                    <div class="show_line_area" id="roll_8"></div>
                </div>
            </div>
        @endif
        @if (in_array('jsxwms', $menus, true))
            <div class="widget-container widget-container-show">
                <div class="widget-content-container">
                    <div class="row show-title">
                        <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">经销商窗膜质保分排名</div>
                        <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_7" class="startdate flatpickr form-control" value="">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_17" class="startdate flatpickr form-control" value="">
                        </div>
                        <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                            <select class="form-control" style="width: 80%;" id="month_7">
                                <option value="">月份总计</option>
                                <option value="01">一月</option>
                                <option value="02">二月</option>
                                <option value="03">三月</option>
                                <option value="04">四月</option>
                                <option value="05">五月</option>
                                <option value="06">六月</option>
                                <option value="07">七月</option>
                                <option value="08">八月</option>
                                <option value="09">九月</option>
                                <option value="10">十月</option>
                                <option value="11">十一月</option>
                                <option value="12">十二月</option>
                            </select>
                        </div>
                        <div style="padding-left: 4%; width: 20%;">
                            <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_7">返回</span>
                            <span style="cursor: pointer;line-height: 380%;" id="look_roll_7">查看更多</span>
                        </div>
                    </div>
                    <div class="show_line_area" id="roll_7"></div>
                </div>
            </div>
        @endif
        @if (in_array('sdqm', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">省代漆膜质保数量排名</div>
                    <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_3" class="startdate flatpickr form-control" value="">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_13" class="startdate flatpickr form-control" value="">
                    </div>
                    <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_3">
                            <option value="">月份总计</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_3">返回</span>
                        <span style="cursor: pointer;line-height: 380%;" id="look_roll_3">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_3" ></div>
            </div>
        </div>
        @endif
        @if (in_array('jsxqm', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">经销商漆膜质保数排名</div>
                    <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_1" class="startdate flatpickr form-control" value="">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_11" class="startdate flatpickr form-control" value="">
                    </div>
                    <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_1">
                            <option value="">月份总计</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_1">返回</span>
                        <span style="cursor: pointer;line-height: 380%;" id="look_roll_1">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_1"></div>
            </div>
        </div>
        @endif
        @if (in_array('sdwm', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">省代窗膜质保数排名</div>
                        <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="开始日期" id="start_date_4" class="startdate flatpickr form-control" value="">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="结束日期" id="start_date_14" class="startdate flatpickr form-control" value="">
                        </div>
                        <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_4">
                            <option value="">{{ ts('月份总计') }}</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_4">{{ ts('返回') }}</span>
                        <span style="cursor: pointer;line-height: 380%;" id="look_roll_4">{{ ts('查看更多') }}</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_4" ></div>
            </div>
        </div>
        @endif
        @if (in_array('jsxwm', $menus, true))
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 30%;padding-left: 10px;line-height: 380%;">{{ ts('经销商窗膜质保数排名') }}</div>
                    <div style="float: left; width: 50%;padding-left: 5%;display: none;" class="start_date">
                            <input type="text" style="width:50%;float: left;" name="startdate" placeholder="{{ ts('开始日期') }}" id="start_date_2" class="startdate flatpickr form-control" value="">
                        <input type="text" style="width:50%;float: left;" name="startdate" placeholder="{{ ts('结束日期') }}" id="start_date_12" class="startdate flatpickr form-control" value="">
                    </div>
                    <div style="float: left; width: 50%; padding-left: 5%;" class="month">
                        <select class="form-control" style="width: 80%;" id="month_2">
                            <option value="">{{ ts('月份总计') }}</option>
                            <option value="01">一月</option>
                            <option value="02">二月</option>
                            <option value="03">三月</option>
                            <option value="04">四月</option>
                            <option value="05">五月</option>
                            <option value="06">六月</option>
                            <option value="07">七月</option>
                            <option value="08">八月</option>
                            <option value="09">九月</option>
                            <option value="10">十月</option>
                            <option value="11">十一月</option>
                            <option value="12">十二月</option>
                        </select>
                    </div>
                    <div style="padding-left: 4%; width: 20%;">
                        <span style="cursor: pointer;display: none;line-height: 380%;" id="return_roll_2">{{ ts('返回') }}</span>
                        <span style="cursor: pointer;float: right;line-height: 380%;" id="look_roll_2">{{ ts('查看更多') }}</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_2"></div>
            </div>
        </div>
        @endif

        <br clear="all" />
    </div>
    </div>
@endsection
@section('script')
    <link rel="stylesheet" href="/dist/flatpickr/flatpickr.css">
    <link rel="stylesheet" href="/dist/flatpickr/material_blue.css">
    <script src="/dist/flatpickr/flatpickr.js"></script>
    <script src="/dist/flatpickr/zh.js"></script>
    <script src="https://code.highcharts.com/highcharts.src.js"></script>
    <script src="/dist/admin/stat.js"></script>
    <script type="text/javascript">
        $(".flatpickr").flatpickr({
            //minDate: $("#year").val() + '-01',
            //maxDate: $("#year").val() + '-12-31',
            locale: "zh",
        });
/*        $('body').on('change', '.flatpickr',function () {
            var date = $(this).val()
            enddate = $(this).parents('.flatpickr-date-range').find('.flatpickr.enddate')
            value = enddate.val()
            enddate.flatpickr({
                minDate: date,
                dateFormat: "m-d",
                locale: "zh"
            })
            enddate.val(value)
        })*/
        $(function () {
            showWindow(1);
            showWindow(2);
            showQm(1);
            showQm(2);
            showScore(1);
            showScore(2);
            showWinScore(1);
            showWinScore(2);
            $("#year").on('change', function () {
                showWindow(1);
                showWindow(2);
                showQm(1);
                showQm(2);
                showScore(1);
                showScore(2);
                showWinScore(1);
                showWinScore(2);
                $(".flatpickr").flatpickr({
                    minDate: $("#year").val() + '-01',
                    maxDate: $("#year").val() + '-12-31',
                    locale: "zh",
                });
                $(".flatpickr").val($("#year").val() + '-01');
            });
            $("#look_roll_1").on("click", function() {
                showMoreQm(1);
                $(this).hide();
            });
            $("#look_roll_2").on("click", function() {
                showMoreQm(2);
                $(this).hide();
            });
            $("#look_roll_3").on("click", function() {
                showMoreWin(1);
                $(this).hide();
            });
            $("#look_roll_4").on("click", function() {
                showMoreWin(2);
                $(this).hide();
            });
            $("#look_roll_5").on("click", function() {
                showMoreScore(1);
                $(this).hide();
            });
            $("#look_roll_6").on("click", function() {
                showMoreScore(2);
                $(this).hide();
            });
            $("#look_roll_7").on("click", function() {
                showMoreWinScore(1);
                $(this).hide();
            });
            $("#look_roll_8").on("click", function() {
                showMoreWinScore(2);
                $(this).hide();
            });
            $("#export_all_sale").on("click", function() {
                exportData('all_sale');
            });
            $("#return_roll_1").on("click", function () {
                $(this).hide();
                showQm(1);
                $("#look_roll_1").show();
            });
            $("#return_roll_2").on("click", function () {
                $(this).hide();
                showQm(2);
                $("#look_roll_2").show();
            });
            $("#return_roll_3").on("click", function () {
                $(this).hide();
                showWindow(1);
                $("#look_roll_3").show();
            });
            $("#return_roll_4").on("click", function () {
                $(this).hide();
                showWindow(2);
                $("#look_roll_4").show();
            });
            $("#return_roll_5").on("click", function () {
                $(this).hide();
                showScore(1);
                $("#look_roll_5").show();
            });
            $("#return_roll_6").on("click", function () {
                $(this).hide();
                showScore(2);
                $("#look_roll_6").show();
            });
            $("#return_roll_7").on("click", function () {
                $(this).hide();
                showWinScore(1);
                $("#look_roll_7").show();
            });
            $("#return_roll_8").on("click", function () {
                $(this).hide();
                showWinScore(2);
                $("#look_roll_8").show();
            });
            $("#month_3").on("change", function () {
                if ($("#look_roll_3").is(":visible")) {
                    showWindow(1);
                } else {
                    showMoreWin(1);
                }
            })
            $("#month_2").on("change", function () {
                if ($("#look_roll_2").is(":visible")) {
                    showQm(2);
                } else {
                    showMoreQm(2);
                }
            })
            $("#month_4").on("change", function () {
                if ($("#look_roll_4").is(":visible")) {
                    showWindow(2);
                } else {
                    showMoreWin(2);
                }
            })
            $("#month_5").on("change", function () {
                if ($("#look_roll_5").is(":visible")) {
                    showScore(1);
                } else {
                    showMoreScore(1);
                }
            })
            $("#month_6").on("change", function () {
                if ($("#look_roll_6").is(":visible")) {
                    showScore(2);
                } else {
                    showMoreScore(2);
                }
            })
            $("#month_7").on("change", function () {
                if ($("#look_roll_7").is(":visible")) {
                    showWinScore(1);
                } else {
                    showMoreWinScore(1);
                }
            })
            $("#month_8").on("change", function () {
                if ($("#look_roll_8").is(":visible")) {
                    showWinScore(2);
                } else {
                    showMoreWinScore(2);
                }
            })
            $("#month_1").on("change", function () {
                if ($("#look_roll_1").is(":visible")) {
                    showQm(1);
                } else {
                    showMoreQm(1);
                }
            })
            $("#start_date_3").on("change", function () {
                if ($("#look_roll_3").is(":visible")) {
                    showWindow(1);
                } else {
                    showMoreWin(1);
                }
            })
            $("#start_date_2").on("change", function () {
                if ($("#look_roll_2").is(":visible")) {
                    showQm(2);
                } else {
                    showMoreQm(2);
                }
            })
            $("#start_date_4").on("change", function () {
                if ($("#look_roll_4").is(":visible")) {
                    showWindow(2);
                } else {
                    showMoreWin(2);
                }
            })
            $("#start_date_5").on("change", function () {
                if ($("#look_roll_5").is(":visible")) {
                    showScore(1);
                } else {
                    showMoreScore(1);
                }
            })
            $("#start_date_6").on("change", function () {
                if ($("#look_roll_6").is(":visible")) {
                    showScore(2);
                } else {
                    showMoreScore(2);
                }
            })
            $("#start_date_7").on("change", function () {
                if ($("#look_roll_7").is(":visible")) {
                    showWinScore(1);
                } else {
                    showMoreWinScore(1);
                }
            })
            $("#start_date_8").on("change", function () {
                if ($("#look_roll_8").is(":visible")) {
                    showWinScore(2);
                } else {
                    showMoreWinScore(2);
                }
            })
            $("#start_date_1").on("change", function () {
                if ($("#look_roll_1").is(":visible")) {
                    showQm(1);
                } else {
                    showMoreQm(1);
                }
            })
            $("#start_date_13").on("change", function () {
                if ($("#look_roll_3").is(":visible")) {
                    showWindow(1);
                } else {
                    showMoreWin(1);
                }
            })
            $("#start_date_12").on("change", function () {
                if ($("#look_roll_2").is(":visible")) {
                    showQm(2);
                } else {
                    showMoreQm(2);
                }
            })
            $("#start_date_14").on("change", function () {
                if ($("#look_roll_4").is(":visible")) {
                    showWindow(2);
                } else {
                    showMoreWin(2);
                }
            })
            $("#start_date_15").on("change", function () {
                if ($("#look_roll_5").is(":visible")) {
                    showScore(1);
                } else {
                    showMoreScore(1);
                }
            })
            $("#start_date_16").on("change", function () {
                if ($("#look_roll_6").is(":visible")) {
                    showScore(2);
                } else {
                    showMoreScore(2);
                }
            })
            $("#start_date_17").on("change", function () {
                if ($("#look_roll_7").is(":visible")) {
                    showWinScore(1);
                } else {
                    showMoreWinScore(1);
                }
            })
            $("#start_date_18").on("change", function () {
                if ($("#look_roll_8").is(":visible")) {
                    showWinScore(2);
                } else {
                    showMoreWinScore(2);
                }
            })
            $("#start_date_11").on("change", function () {
                if ($("#look_roll_1").is(":visible")) {
                    showQm(1);
                } else {
                    showMoreQm(1);
                }
            })
            $("#return_country_task").on("click", function () {
                $(this).hide();
                showCountryTask();
            });
            $("#distributions").select2();
            $("#cities").select2();
            $("#cities").on("change", function() {
                showQm(1);
                showQm(2);
                showScore(1);
            });

            $("#distributions").on("change", function () {
                showQm(1);
                showQm(2);
                showScore(1);
                $("#all_country").removeClass('btn-secondary').addClass('btn-primary');
                if ($("#distributions").val() == '' || typeof $("#distributions").val() == 'undefined' || $("#distributions").val() == null) {
                    return;
                }
                request.post('/admin/stat/getCities', {
                    dist_id: $("#distributions").val(),
                }).then(function (d) {
                    let data = d.list;
                    console.log(data);
                    $("#cities").empty().append('<option selected disabled value="">选择城市</option>');
                    if (data != '' && data.length > 0) {
                        for (let i in data) {
                            $("#cities").append('<option value="' + data[i]['id'] + '">'+ data[i]['simplified_chiness_value'] +'</option>');
                        }
                    }
                }).catch( function(d) {
                    let data = d.list;
                    console.log(data);
                    $("#cities").empty().append('<option selected disabled value="">选择城市</option>');
                    if (data != '' && data.length > 0) {
                        for (let i in data) {
                            $("#cities").append('<option value="' + data[i]['id'] + '">'+ data[i]['simplified_chiness_value'] +'</option>');
                        }
                    }
                });
            });

            $("#dealers").on('change', function () {
                $("#all_country").removeClass('btn-secondary').addClass('btn-primary');
                showQm(1);
                showQm(2);
                showScore(1);
            });
            $("#select_day").on("click", function () {
                $(this).removeClass('btn-primary').addClass('btn-secondary');
                $("#select_month").removeClass('btn-secondary').addClass('btn-primary');
                $("#month_1").val('');
                $("#month_2").val('');
                $("#month_3").val('');
                $("#month_4").val('');
                $("#month_5").val('');
                $("#month_6").val('');
                $("#month_7").val('');
                $("#month_8").val('');
                $(".start_date").show();
                $(".month").hide();
                $("#start_date_1").val('');
                $("#start_date_2").val('');
                $("#start_date_3").val('');
                $("#start_date_4").val('');
                $("#start_date_5").val('');
                $("#start_date_5").val('');
                $("#start_date_7").val('');
                $("#start_date_8").val('');
            });
            $("#select_month").on("click", function () {
                $(this).removeClass('btn-primary').addClass('btn-secondary');
                $("#select_day").removeClass('btn-secondary').addClass('btn-primary');
                $(".start_date").hide();
                $(".month").show();
                $("#month_1").val('');
                $("#month_2").val('');
                $("#month_3").val('');
                $("#month_4").val('');
                $("#month_5").val('');
                $("#month_6").val('');
                $("#month_7").val('');
                $("#month_8").val('');
                $("#start_date_1").val('');
                $("#start_date_11").val('');
                $("#start_date_12").val('');
                $("#start_date_13").val('');
                $("#start_date_14").val('');
                $("#start_date_15").val('');
                $("#start_date_16").val('');
                $("#start_date_17").val('');
                $("#start_date_18").val('');
                $("#start_date_2").val('');
                $("#start_date_3").val('');
                $("#start_date_4").val('');
                $("#start_date_5").val('');
                $("#start_date_6").val('');
                $("#start_date_7").val('');
                $("#start_date_8").val('');
            });
            $("#all_country").on('click', function () {
                $("#distributions").val('').trigger('change');
                $("#cities").val('').trigger('change');
                $(this).removeClass('btn-primary').addClass('btn-secondary');
            });
        });

        function exportData(type) {
            let url = '/admin/statExport/index?type=' + type;
            if ($("#year").val() != '' && typeof $("#year").val() != 'undefined') {
                url += '&year=' + $("#year").val();
            }
            if ($("#month").val() != '' && typeof $("#month").val() != 'undefined' && $("#month").val() != null) {
                url += '&month=' + $("#month").val();
            }
            if ($("#distributions").val() != '' && typeof $("#distributions").val() != 'undefined' && $("#distributions").val() != null) {
                url += '&dist_id=' + $("#distributions").val();
            }
            if ($("#dealers").val() != '' && typeof $("#dealers").val() != 'undefined' && $("#dealers").val() != null) {
                url += '&dealer_id=' + $("#dealers").val();
            }
            location.href = url;
        }

        function showMoreQm(type) {
            $.ajax({
                url: '/admin/stat/detail_dealer_stat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_1").val() : $("#month_2").val(),
                    start_date: type == 1 ? $("#start_date_1").val() : $("#start_date_2").val(),
                    end_date: type == 1 ? $("#start_date_11").val() : $("#start_date_12").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                    city_id: $("#cities").val(),
                    type: type,
                    page: 'all',
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    let id = type == 1 ? '#roll_1' : '#roll_2';
                    let return_id = type == 1 ? '#return_roll_1' : '#return_roll_2';
                    $(return_id).show();
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        $(id).empty();
                        return;
                    }
                    let abbr_name = typeof  data.dist_info != 'undefined' && data.dist_info != '' ? data.dist_info : '经销商';
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>序号</th><th style="width: 70%; word-break: break-word;">' + abbr_name + '</th><th>数量</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + (parseInt(i) + 1) + '</td><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function showQm(type) {
            $.ajax({
                url: '/admin/stat/detail_dealer_stat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_1").val() : $("#month_2").val(),
                    start_date: type == 1 ? $("#start_date_1").val() : $("#start_date_2").val(),
                    end_date: type == 1 ? $("#start_date_11").val() : $("#start_date_12").val(),
                    dist_id: $("#distributions").val(),
                    type: type,
                    city_id: $("#cities").val(),
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    Highcharts.chart(type == 1 ? 'roll_1' : 'roll_2', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: ''
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            }
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        tooltip: {
                            pointFormat: '数量: <b>{point.y} </b>'
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDealerRolls(event.point.name, type);
                                    }
                                }
                            }
                        },
                        series: [{
                            name: '数量',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showDealerRolls(name, type) {
            $.ajax({
                url: '/admin/stat/showDealerWarrantyDetail',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_1").val() : $("#month_2").val(),
                    start_date: type == 1 ? $("#start_date_1").val() : $("#start_date_2").val(),
                    end_date: type == 1 ? $("#start_date_11").val() : $("#start_date_12").val(),
                    name: name,
                    type: type,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>日期</th><th>数量</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_1" : "#return_roll_2").show();
                    $(type == 1 ? "#look_roll_1" : "#look_roll_2").hide();
                    $(type == 1 ? "#roll_1" : "#roll_2").empty().addClass('show-over').append(table);
                }
            });
        }

        function showMoreWin(type) {
            $.ajax({
                url: '/admin/stat/detail_dist_stat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    start_date: type == 1 ? $("#start_date_3").val() : $("#start_date_4").val(),
                    end_date: type == 1 ? $("#start_date_13").val() : $("#start_date_14").val(),
                    type: type,
                    page: 'all',
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let id = type == 1 ? '#roll_3' : '#roll_4';
                    let return_id = type == 1 ? '#return_roll_3' : '#return_roll_4';
                    $(return_id).show();
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        $(id).empty();
                        return false;
                    }


                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>序号</th><th>省代</th><th>数量</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + (parseInt(i) + 1) + '</td><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function showWindow(type) {
            $.ajax({
                url: '/admin/stat/detail_dist_stat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    start_date: type == 1 ? $("#start_date_3").val() : $("#start_date_4").val(),
                    end_date: type == 1 ? $("#start_date_13").val() : $("#start_date_14").val(),
                    type: type,
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    var chart = Highcharts.chart(type == 1 ? 'roll_3' : 'roll_4', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: '',
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            },
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDistRolls(event.point.name, type);
                                    }
                                }
                            }
                        },
                        tooltip: {
                            pointFormat: '数量: <b>{point.y} </b>'
                        },
                        series: [{
                            name: '数量',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showDistRolls(name, type) {
            $.ajax({
                url: '/admin/stat/showDistWarrantyDetail',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    start_date: type == 1 ? $("#start_date_3").val() : $("#start_date_4").val(),
                    end_date: type == 1 ? $("#start_date_13").val() : $("#start_date_14").val(),
                    type: type,
                    name: name,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>日期</th><th>数量</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_3" : "#return_roll_4").show();
                    $(type == 1 ? "#look_roll_3" : "#look_roll_4").hide();
                    $(type == 1 ? "#roll_3" : "#roll_4").empty().addClass('show-over').append(table);
                }
            });
        }

        function showScore(type) {
            $.ajax({
                url: '/admin/stat/detailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_5").val() : $("#month_6").val(),
                    start_date: type == 1 ? $("#start_date_5").val() : $("#start_date_6").val(),
                    end_date: type == 1 ? $("#start_date_15").val() : $("#start_date_16").val(),
                    type: type,
                    dist_id: $("#distributions").val(),
                    city_id: $("#cities").val(),
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    var chart = Highcharts.chart(type == 1 ? 'roll_5' : 'roll_6', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: '',
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            },
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDealerScore(event.point.name, type);
                                    }
                                }
                            }
                        },
                        tooltip: {
                            pointFormat: '数量: <b>{point.y} </b>'
                        },
                        series: [{
                            name: '数量',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showWinScore(type) {
            $.ajax({
                url: '/admin/stat/detailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_7").val() : $("#month_8").val(),
                    start_date: type == 1 ? $("#start_date_7").val() : $("#start_date_8").val(),
                    end_date: type == 1 ? $("#start_date_17").val() : $("#start_date_18").val(),
                    type: type,
                    product_type_id: 2,
                    dist_id: $("#distributions").val(),
                    city_id: $("#cities").val(),
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    var chart = Highcharts.chart(type == 1 ? 'roll_7' : 'roll_8', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: '',
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            },
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDealerWinScore(event.point.name, type);
                                    }
                                }
                            }
                        },
                        tooltip: {
                            pointFormat: '数量: <b>{point.y} </b>'
                        },
                        series: [{
                            name: '数量',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showDealerScore(name, type) {
            $.ajax({
                url: '/admin/stat/showDetailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_5").val() : $("#month_6").val(),
                    start_date: type == 1 ? $("#start_date_5").val() : $("#start_date_6").val(),
                    end_date: type == 1 ? $("#start_date_15").val() : $("#start_date_16").val(),
                    type: type,
                    name: name,
                    city_id: $("#cities").val(),
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜名</th><th>分数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_5" : "#return_roll_6").show();
                    $(type == 1 ? "#look_roll_5" : "#look_roll_6").hide();
                    $(type == 1 ? "#roll_5" : "#roll_6").empty().addClass('show-over').append(table);
                }
            });
        }

        function showDealerWinScore(name, type) {
            $.ajax({
                url: '/admin/stat/showDetailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_7").val() : $("#month_8").val(),
                    start_date: type == 1 ? $("#start_date_7").val() : $("#start_date_8").val(),
                    end_date: type == 1 ? $("#start_date_17").val() : $("#start_date_18").val(),
                    type: type,
                    name: name,
                    product_type_id: 2,
                    city_id: $("#cities").val(),
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜名</th><th>分数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_7" : "#return_roll_8").show();
                    $(type == 1 ? "#look_roll_7" : "#look_roll_8").hide();
                    $(type == 1 ? "#roll_7" : "#roll_8").empty().addClass('show-over').append(table);
                }
            });
        }

        function showMoreScore(type) {
            $.ajax({
                url: '/admin/stat/detailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_5").val() : $("#month_6").val(),
                    start_date: type == 1 ? $("#start_date_5").val() : $("#start_date_6").val(),
                    end_date: type == 1 ? $("#start_date_15").val() : $("#start_date_16").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                    type: type,
                    page: 'all',
                    city_id: $("#cities").val(),
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    let id = type == 1 ? '#roll_5' : '#roll_6';
                    let return_id = type == 1 ? '#return_roll_5' : '#return_roll_6';
                    $(return_id).show();
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        $(id).empty();
                        return;
                    }
                    let abbr_name = typeof  data.dist_info != 'undefined' && data.dist_info != '' ? data.dist_info : '经销商';
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>序号</th><th style="width: 60%;word-break: break-word;">' + abbr_name + '</th><th>分数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + (parseInt(i) + 1) + '</td><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function showMoreWinScore(type) {
            $.ajax({
                url: '/admin/stat/detailDealerScoreStat',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_7").val() : $("#month_8").val(),
                    start_date: type == 1 ? $("#start_date_7").val() : $("#start_date_8").val(),
                    end_date: type == 1 ? $("#start_date_17").val() : $("#start_date_18").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                    product_type_id: 2,
                    type: type,
                    page: 'all',
                    city_id: $("#cities").val(),
                    all_dist_id: '{{ $distribution_ids ? implode(",", $distribution_ids) : '' }}'
                },
                dataType: 'json',
                success: function (data) {
                    let id = type == 1 ? '#roll_7' : '#roll_8';
                    let return_id = type == 1 ? '#return_roll_7' : '#return_roll_8';
                    $(return_id).show();
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        $(id).empty();
                        return;
                    }
                    let abbr_name = typeof  data.dist_info != 'undefined' && data.dist_info != '' ? data.dist_info : '经销商';
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>序号</th><th style="width: 60%;word-break: break-word;">' + abbr_name + '</th><th>分数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + (parseInt(i) + 1) + '</td><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function getCities() {

        }
    </script>
@endsection
